<template>
    <div id="seachDialog">
      <a-modal
        :title="blackData.title"
        v-model="blackData.show"
        width="400px"
        style="overflow:hidden"
        @cancel="handleClose">
        <el-row style="padding:20px 30px">
            <el-form ref="Form" size="small" :rules="rules" :model="parames" label-width="100px" >
                <el-form-item :label="blackData.type=='black'?'是否拉黑':'是否废业'" prop="radio">
                  <el-radio v-model="parames.radio" :label="true">是</el-radio>
                  <el-radio v-model="parames.radio" :label="false">否</el-radio>
                </el-form-item>
            </el-form>
        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button size="small" @click="handleClose">取消</el-button>
            <el-button size="small" type="primary" @click="handleSave">保存</el-button>
        </span>
      </a-modal>
    </div>
</template>

<script>
export default {
    props: ['blackData'],
    data() {
        return {
          parames: {
              radio: ''
          },
          rules: {
            radio: [
              { required: true, message: "不能为空", trigger: ['blur','change']},
            ],
          }
        };
    },
    methods: {
        handleClose () {
            this.blackData.show = false
        },
        handleSave () {
            this.$refs['Form'].validate((valid) => {
                if (valid) {
                  if (this.blackData.type == 'black') {
                    this.$post(this.$api.postCustomerCoreBlacklist,{
                        customerId: this.blackData.id,
                        blacklisted: this.parames.radio,
                    }).then(response => {
                        if (response.data.succeed) {
                            this.$emit('checkRender')
                            this.$message({
                                message: '设置成功',
                                type: 'success'
                            });
                            this.handleClose()
                        }
                    })
                  } else if (this.blackData.type == 'feiye') {
                    this.$post(this.$api.postCustomerCoreWasteIndustry,{
                        customerId: this.blackData.id,
                        wasteIndustry: this.parames.radio,
                    }).then(response => {
                        if (response.data.succeed) {
                            this.$emit('checkRender')
                            this.$message({
                                message: '设置成功',
                                type: 'success'
                            });
                            this.handleClose()
                        }
                    })
                  }
                }       
            })
        },
        resetData () {
            this.parames.radio = ''
        }
    },
    computed: {
      changeDialog () {
        return this.blackData.show
      }
    }, 
    watch: {
      changeDialog: {
        handler (curVal, oldVal) {
          if (curVal) {
            this.parames.radio = this.blackData.blacklisted
          } else {
            this.resetData()
          }
        }
      }
    }
};
</script>

<style>
#seachDialog .el-dialog{
    padding-bottom: 0; 
    overflow-x: hidden;
}
#seachDialog .el-dialog__footer{
    border-top: #f4f4f4 solid 1px;
}
</style>
